<template lang="pug">
  .container.tutorship__teacher__main
    .row
      .col-sm-3
        h2.side__menu__title 课本
          .side__menu__switch.side__menu__switch_teacher(@click.stop="selectBook")
            i.icon_switch_normal
            | 切换
          .side__menu__switch.side__menu__switch_teacher(@click.stop="addBook")
            i.icon_switch_normal
            | 添加
      .col-sm-9
        h2.tutorship__main__title__teacher 作业辅导名称：p5练习
          .title_actions
            span.col-md-offset-7 共3个资源
            a.btn-teacher.btn.btn-sm(href="") 导入微课
            a.btn-teacher.btn.btn-sm(href="") 导出题目          
      .col-sm-3
        h3.side__menu__dt 高二课本
        ul.side__menu__list
          li
            a(href="") 第11章   坐标平面有理数函数
            ul
              li
                a(href="") 二次函数
              li
                a(href="") 不等式方式
                ul
                  li
                    a(href="") 坐标平面有理数函数
      .col-sm-9
        .tutorship__teacher__item
          .tutorship__teacher__item__hd
            .item_index  1题
            .item_move.btns
              a.btn.btn-sm.btn_move.move_up 上移
              a.btn.btn-sm.btn_move.move_down 下移
          .tutorship__teacher__item__bd
            h5 1.（2017北京试题）如果向北走6步记做+6，那么向北走8步记做？（）
            ol(type="A")
              li +8
              li +8
              li +8
              li +8
          .tutorship__teacher__item__ft
            .item_ft_actions
              a.btn.btn-sm.btn-actions 听讲解
              a.btn.btn-sm.btn-actions 下载
              a.btn.btn-sm.btn-actions 移除
            .item_ft_count
              span 听讲解: 7人
              span 加入错题集: 5人
        page
</template>
<style lang="scss">
  .container.tutorship__teacher__main{
    .side__menu__title .side__menu__switch{
      float: right;
      position: initial;
      margin-top: 6px;
    }
    .tutorship__teacher__item{
      margin-top: 15px;
      padding: 14px 20px;
      border-radius: 10px;
      background: #fafafa;
    }
    .side__menu__list a{
      color: $teacherMainColor;
    }
    .title_actions {
      display: inline-block;
      float: right;
    }
    .btn-teacher:hover {
      background-color: $teacherMainColor;
      color: #fff;
    }
    .tutorship__teacher__item__hd {
      font-size: 12px;
      margin-top: 10px;
      margin-bottom: 20px;
      .item_index {
        font-weight: bold;
        color: #000000;
        display: inline-block;
      }
      .item_move {
        display: inline-block;
        float: right;
        .btn_move {
          border: 1px solid $teacherMainColor;
          border-radius: 6px;
          color: $teacherMainColor;
          width: 66px;
          font-size: 12px;
          margin-left: 20px;
          cursor: pointer;
        }
        .btn_move:hover {
          background-color: $teacherMainColor;
          color: #fff;
        }
      }
    }
    .tutorship__teacher__item__bd {
      border-top: 1px solid #ececec;
      border-bottom: 1px solid #ececec;
      padding: 12px 0 50px;
      font-size: 14px;
      h5 {
        font-size: 14px;
      }
      ol {
        @include clearfix();
        padding: 0;
        margin: 0;
        margin-top: 15px;
        li {
          float: left;
          width: 100px;
          list-style-position: inside;
        }
      }
    }
    .tutorship__teacher__item__ft {
      margin-top: 10px;
      .item_ft_actions {
        display: inline-block;
        cursor: pointer;
        .btn-actions {
          border: 1px solid $teacherMainColor;
          border-radius: 6px;
          color: $teacherMainColor;
          width: 66px;
          font-size: 12px;
          margin-left: 20px;
        }
        .btn-actions:hover {
          background-color: $teacherMainColor;
          color: #fff;
        }
      }
      .item_ft_count {
        display: inline-block;
        float: right;
        color: #848484;
        font-size: 12px;
        span {
          padding-left: 10px;
        }
      }
    }
  }
</style>
<script>
export default {
  methods: {
    addBook () {
      this.$store.commit('addLession', true)
    },
    selectBook () {
      this.$store.commit('switchLession', {
        teacher: true
      })
    }
  }
}
</script>

